<template>
  <div class="page">
    <m-header :title="langText&&langText.submitquestion" :canback="Boolean(1)"> </m-header>
      <div class="body">

        <table>
          <tr>
            <th>{{langText&&langText.questionnumber}}</th>
            <th>{{langText&&langText.time}}</th>
            <th>  </th>
          </tr>
          <tr v-for="(item,index) in list" :key="index" >
            <td>{{item.id}}</td>
            <td>{{item.create_time.substring(0,10)}}</td>
            <td>
              <button class="sm-btn" @click="$router.push({name:'Selected',query:{id:item.id}})">{{langText&&langText.problemdetails}}</button>
            </td>
          </tr>
          <div class="tab_bot"></div>
        </table>

        <button class="btn-submit btn-origin bot-btn" @click="$router.push({name:'newMessage'})">{{langText&&langText.submitquestion}}</button>

      </div>
    <m-load ref="load"></m-load>
    <m-Footer></m-Footer>
  </div>
</template>
<script>
import { Util, Load } from "@/assets/commonjs/utils.js";
import { Init, Base, Owner } from "@/server/server.js";
import { mapGetters } from "vuex";
import { MyTxt,TradeTxt } from "@/assets/commonjs/lan.js";
export default {
  data() {
    return {
      list:[],
      allTxt:null,
      type:null,
      langText:null,
      page:1
    }
  },
  computed: {
    ...mapGetters(["uid","userInfo","lang"])
  },
  created() {
      
  },
  mounted(){
    this.initDate();
    this.messageRecord();
  },
  computed: {
    ...mapGetters(['getLangId'])
  },
  methods: {
    initDate(){
      this.allTxt = Object.assign({},MyTxt,TradeTxt)
      this.langText = Object.assign({},JSON.parse(localStorage.getItem('mineData')))
    },
    messageRecord(){
      Owner.messageRecord({page:this.page,num:999}).then(res=>{
        if(res.code==1){
          this.list = res.data.message;
        }else{
          mui.toast(res.msg)
        }
      })
    }
  }
};
</script>
<style lang="less" scoped>
@import "~link-less";
.body {
  // padding: @margin-primary;
  background-color: @bg-color;
  table{
    width: 710px;
    margin-left: 20px;
    margin-top: 30px;
    text-align: center;
    background-color: #fff;
    border-radius: 10px;
    box-sizing: border-box;
    border: 20px solid #fff;
    border-top: none;
    border-bottom: none;
    // border-collapse:20px;
    th{
      height: 80px;
      line-height: 80px;
      font-size:32px;
      font-weight:400;
      color:rgba(51,51,51,1);
    }
    tr{
      line-height: 60px;
      color: #999;
      &:first-child{
        border-bottom: 1px solid #ddd;
        border-collapse:20px;
      }
      .sm-btn{
        font-size:32px;
        background-color: #4EB6AD;
        padding: 12px 62px;
        margin: 15px 0;
      }
    }
    .tab_bot{
      height: 72px;
      background-color: #fff;
      border-radius: 10px;
    }
  }
  .bot-btn{
    width: 710px;
    margin-left: 20px;
    height: 88px;
    line-height: 88px;
    margin-top: 30px;
  }
}
.page{
  /deep/ section .header .nav{
    background-color: #fff !important;
    span{
      color: #000;
    }
    .center{
      color: #000;
    }
  }
}
</style>
